<!DOCTYPE html>
<html lang="zh-cmn-Hans">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>鹿程智慧油站商户平台</title>
		<meta name="description" content="鹿程科技是提供加油站互联网化零管系统、营销及支付和大数据分析运营服务的行业领先科技公司。鹿程科技充分了解加油站行业的需求和新兴互联网的发展,依靠业内最先进的科技和标准化的运营,持续帮助油站业务发展创造价值。"/>
		<meta name="keywords" content="智慧油站,鹿程,鹿程智慧油站,鹿程智慧油站微信支付,加油站微信支付,加油站营销管理"/>
		<link rel="icon" href="https://static.zhihuiyouzhan.com.cn/static/styles/admin/img/title.ico" type="image/x-icon">
		<link rel="shortcut icon" href="https://static.zhihuiyouzhan.com.cn/static/styles/admin/img/title.ico" type="image/x-icon">
		<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
		<link rel="stylesheet" href="../layui/css/layui.css" />
		<link rel="stylesheet" href="../css/style.css" />
	</head>
<body>
	<section class="section-right">
		<!--deer-content-->
		<div class="deer-content">
			<div class="marke-recall-tit marke-strategy-tit">
				<dl>创建群发优惠券策略<i></i><span></span></dl>
				<dl>选择人员</dl>
				<dl class="active">确认信息</dl>
			</div>
			
			<div class="mark-pan">
				  <p>已选择<span class="people">66</span>人，共需发放<span class="all_coupon"> 6</span>张营销券，总价值约<span class="total_money"> 66 </span>元。</p>
			<form class="people-form layui-form" method="post" action="">
				<dl class="layui-inline">
				    <dt class="">会员手机号</dt>
				    <dd>
				    <div class="layui-input-inline">
				    <input type="text" name="price_min" placeholder="请输入手机号" autocomplete="off" class="layui-input">
				  	</div>
				    </dd>
				    <dt lay-submit lay-filter="formDemo">立即提交</dt>
				    <dt style="margin-left: 20px;">清除队列</dt>
					</dl>
			</form>
			<table id="demo" lay-filter="test" style="width: 100%;"></table>
			<div class="mark-remove">批量移除已全选</div>
			
			<div class="order-table-footer clearfix">
				<div class="order-table-page">
					<div id="datatime">
							
					</div>
				</div>
			</div>
			<!--submit-->
				<div class="marke-strategy-submit">
						下一步，开始发放
				</div>
			</div>
		<!--/deer-content-->
	</section>
	<!--js-->
		<aside>
			<script type="text/javascript" src="../layui/layui.js" ></script>
			<script type="text/javascript">
				layui.use(['jquery','table' ,'laypage'],function(){
					var $=layui.jquery
					var table = layui.table;
					var laypage = layui.laypage;
				//加载表格数据
				function init(){
				  var data=[{"id":10000,"name":"金","phone":"15965485421","pian":"--","cost":"900"},{"id":10000,"name":"金","phone":"15965485421","pian":"--","cost":"900"}];
				  table.render({
				    elem: '#demo'				  
				    /*,url: '/鹿程/营销中心/aaa.json'*/
				    ,cols: [[ //表头
				      {type:'checkbox', width:'3%'}
				      ,{field: 'name',  width:'19%',align:'center',title: '会员名称'}
				      ,{field: 'phone', width:'19%',align:'center',title: '手机号'}
				      ,{field: 'pian',  width:'19%',align:'center',title: '油品偏好'}
				      ,{field: 'cost',  width:'19%',align:'center',title: '消费金额',sort: true}				     
				      ,{fixed: 'right', width:'19%',align:'center',title: '操作', toolbar: '#barDemo'}
				      
				    ]]
				    ,data:data
				  });
				}
				init();
				//分页
				laypage.render({
				    elem: 'datatime'
				    ,count: 100//data.length
				    ,theme: '#00cc9a'
			    	,prev: '«'
			    	,next: '»'
			  	})
				//工具条（删除）监听
				table.on('tool(test)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
				  var data = obj.data; //获得当前行数据
				  var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
				  var tr = obj.tr; //获得当前行 tr 的DOM对象
				 
				  if(layEvent === 'del'){ //删除
				    layer.confirm('真的删除行么', function(index){
				      obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
				      layer.close(index);
				      //向服务端发送删除指令
				    });
				  } 
				});				
				
				//移除全选
				$(".mark-remove").click(function(){
					var checkStatus = table.checkStatus('demo'); 
					if(checkStatus.isAll) //表格是否全选
					{
						var checkDiv=$('.layui-table-box').find('.layui-form-checkbox');
	                	var checked=$('.layui-table-box').find(':checkbox');
						checkDiv.removeClass('layui-form-checked')
	                    checked.each(function(index,value){
	                        value.checked =false;
	                        table.cache.demo[index].LAY_CHECKED = false;
	                    })
	                 
					}
					
				});
				})				
		
			</script>
			<script type="text/html" id="barDemo"> 
			  <a class="layui-btn-xs" lay-event="del">移除</a>
			</script>
		</aside>
		<!--/js-->
</body>
</html>